<div {{$attributes}}>
    <div class="relative">
        <img class="absolute right-2 top-2" src="{{ asset('img/collect_btn.png') }}" alt="collect btn" width="35" height="35">

        <a wire:navigate href="{{ $video->presenter()->show }}">
            <img class="w-full aspect-video object-cover rounded-md" src="{{ file_url($video->picture) }}" alt="{{ $video->title }}">

            @if($video->vip)
                <span class="absolute left-0 top-0 text-white px-1 bg-gradient-to-tr from-[#fad961] to-[#f76b1c] rounded-tl-md">VIP</span>
            @endif

            <span class="p-2 pt-3 absolute inset-x-0 bottom-0 bg-gradient-to-b from-transparent to-[rgba(0,0,0,0.5)] text-white">
                03:12
            </span>
        </a>
    </div>

    <div class="truncate pt-1 text-sm">
        <a href="{{ $video->presenter()->show }}">{{ $video->title }}</a>
    </div>
</div>
